<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<ui:composition template="/layouts/default.xhtml">
	<ui:define name="title">#{text['paiementDetail.title']}</ui:define>
	<ui:param name="menu" value="EleveMenu" />
	<ui:param name="menuleft" value="PaiementFormMenu" />
	<ui:param name="menudetailtop" value="PaiementListMenu" />
	<ui:param name="menudetaileleve" value="EleveDetailMenu"/>
	<ui:param name="menudetail" value="EleveDetailMenu"/>

	<ui:define name="body">
		<c:set var="delObject" value="#{text['paiementList.paiement']}" />
		<script type="text/javascript">var msgDelConfirm =
           "<h:outputFormat value="#{text['delete.confirm']}"><f:param value="#{delObject}" /></h:outputFormat>";
        </script>
		<div class="col-sm-12">
			<ui:include src="/common/eleve-detail-top.xhtml"/>
			<h:form id="paiementForm">
					
				<div class="form-group">
					<h:inputHidden value="#{paiementController.paiement.id}" id="id" />
					<h:inputHidden value="#{paiementController.paiement.eleve.id}" id="idEleve" />
				</div>
					
				<div class="page-header">
					<h3>#{text['paiement.tab.listPay']}</h3>
				</div> 
						
	            <p:dataTable id="paiements" var="paiement" value="#{paiementController.paiements}"
	                         sortBy="#{paiementController.sortColumn}">
	                <p:column style="text-align:center;">
	                    <f:facet name="header">
	                        <p:column sortBy="datePaiement">
	                            <h:outputText value="#{text['paiement.datePaiement']}" />
	                        </p:column>
	                    </f:facet>
	   					<h:outputText value="#{paiement.datePaiement}" escape="true">
	   						<f:convertDateTime pattern="#{text['date.format']}" />
	   					</h:outputText>
	                </p:column>
	                <p:column>
	                    <f:facet name="header">
	                        <p:column sortBy="eleve">
	                            <h:outputText value="#{text['paiement.eleve']}" />
	                        </p:column>
	                    </f:facet>
	                    <h:outputText value="#{paiement.eleve.fullName}" escape="true"/>
	                </p:column>
	                <p:column>
	                    <f:facet name="header">
	                        <p:column sortBy="moisPaye.libelle">
	                            <h:outputText value="#{text['paiement.moisPaye']}" />
	                        </p:column>
	                    </f:facet>
	   					<h:outputText value="#{paiement.moisPaye.libelle}" escape="true"/>
	                </p:column>
	                <p:column>
	                    <f:facet name="header">
	                        <p:column sortBy="avance">
	                            <h:outputText value="#{text['paiement.avance']}" />
	                        </p:column>
	                    </f:facet>
	   					<h:outputText value="#{paiement.avance}" escape="true"/>
	                </p:column>
	                
	                <p:column>
	                    <f:facet name="header">
	                        <p:column sortBy="avance">
	                            <h:outputText value="#{text['paiement.reste']}" />
	                        </p:column>
	                    </f:facet>
	   					<h:outputText value="#{paiement.reste}" escape="true"/>
	                </p:column>
	                
	                <p:column style="width:4%">  
			            <p:commandLink id="detail-paiement"	update=":paiementForm:displayDetail" oncomplete="dlgDetail.show()" styleClass="glyphicon glyphicon-eye-open" title="#{text['button.view']}">
							<f:setPropertyActionListener value="#{paiement}" target="#{paiementController.paiement}" />
						</p:commandLink>
			        </p:column>
			        
			        <p:column style="width:4%">  
			            <p:commandLink id="paiement-history" update=":paiementForm:displayPayHistList" oncomplete="dlgPayHistoryList.show()" styleClass="glyphicon glyphicon-list" title="#{text['button.view']}">
							<f:setPropertyActionListener value="#{paiement}" target="#{paiementController.paiement}" />
						</p:commandLink>
			        </p:column>
			        
			        <p:column style="width:4%">  
			           <h:commandLink action="#{paiementController.edit}"
							title="#{text['button.edit']}">
							<f:param name="id" value="#{paiement.id}" />
							<f:param name="from" value="listPay" />
							<span class="glyphicon glyphicon-pencil"></span>
						</h:commandLink>
			        </p:column>
			        
		            </p:dataTable>
		            
					<p:dialog header="#{text['paiementHistory.list.title']}" width="70%"
						resizable="false" id="displayPayHistList" widgetVar="dlgPayHistoryList"
						showEffect="fade" hideEffect="highlight" modal="true">	
						 <p:dataTable id="paiementHistory" var="paiementHistory" value="#{paiementController.paiement.paiementHistory}"
	                         sortBy="#{paiementController.sortColumn}">
	                         
	                          <p:column>
				                    <f:facet name="header">
				                        <p:column sortBy="avance">
				                            <h:outputText value="#{text['paiement.datePaiement']}" />
				                        </p:column>
				                    </f:facet>
				   					<h:outputText value="#{paiementHistory.datePaiement}" escape="true">
				   						<f:convertDateTime pattern="#{text['date.format']}" />
									</h:outputText>
			                 </p:column>
			                 
			                  <p:column>
				                    <f:facet name="header">
				                        <p:column sortBy="avance">
				                            <h:outputText value="#{text['paiement.avance']}" />
				                        </p:column>
				                    </f:facet>
				   					<h:outputText value="#{paiementHistory.avance}" escape="true"/>
			                 </p:column>
			                 
			                  <p:column>
				                    <f:facet name="header">
				                        <p:column sortBy="avance">
				                            <h:outputText value="#{text['paiement.reste']}" />
				                        </p:column>
				                    </f:facet>
				   					<h:outputText value="#{paiementHistory.reste}" escape="true"/>
			                 </p:column>
			                 
			                  <p:column>
				                    <f:facet name="header">
				                        <p:column sortBy="avance">
				                            <h:outputText value="#{text['paiement.numeroCheque']}" />
				                        </p:column>
				                    </f:facet>
				   					<h:outputText value="#{paiementHistory.numeroCheque}" escape="true"/>
			                 </p:column>
			        
	                     </p:dataTable>
	                     	
					</p:dialog>
					
		             <p:dialog header="#{text['paiementDetail.title']}" width="70%"
						resizable="false" id="displayDetail" widgetVar="dlgDetail"
						showEffect="fade" hideEffect="highlight" modal="true">
						
						<div class="row">
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" for="datePaiement" value="#{text['paiement.datePaiement']}" />
									<footer>
										<h:outputText id="datePaiement" value="#{paiementController.paiement.datePaiement}" escape="true">
											<f:convertDateTime pattern="#{text['date.format']}" />
										</h:outputText>
									</footer>
								</blockquote>
							</div>
							
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" for="anneeScolaire" value="#{text['anneeScolaire.anneeScolaire']}" />
									<footer>
										<h:outputText id="anneeScolaire" value="#{paiementController.paiement.anneeScolaire.anneeScolaire}" escape="true"/>
									</footer>
								</blockquote>
							</div>
							
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" value="#{text['paiement.eleve']}" />
									<footer>
										<h:outputText id="eleve" value="#{paiementController.paiement.eleve.fullName}" escape="true"/>
									</footer>
								</blockquote>
							</div>
						</div>
						
						<div class="row">
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" for="moisPaye" value="#{text['paiement.moisPaye']}" />
									<footer>
										<h:outputText id="moisPaye" value="#{paiementController.paiement.moisPaye.libelle}" escape="true"/>
									</footer>
								</blockquote>
							</div>
							
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" for="avance" value="#{text['paiement.avance']}" />
									<footer>
										<h:outputText id="avance" value="#{paiementController.paiement.avance}" escape="true"/>
									</footer>
								</blockquote>
							</div>
							
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" for="reste" value="#{text['paiement.reste']}" />
									<footer>
										<h:outputText id="reste" value="#{paiementController.paiement.reste}" escape="true"/>
									</footer>
								</blockquote>
							</div>
						</div>
						
						<div class="row">
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" for="modePaiement" value="#{text['paiement.modePaiement']}" />
									<footer>
										<h:outputText id="modePaiement" value="#{paiementController.paiement.modePaiement.libelle}" escape="true"/>
									</footer>
								</blockquote>
							</div>
							
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" for="numeroCheque" value="#{text['paiement.numeroCheque']}" />
									<footer>
										<h:outputText id="numeroCheque" value="#{paiementController.paiement.numeroCheque}" escape="true"/>
									</footer>
								</blockquote>
							</div>
							
							<div class="col-sm-4 form-group">
								<blockquote>
									<h:outputLabel styleClass="control-label" value="#{text['paiement.description']}" />
									<footer>
										<h:outputText id="description" value="#{paiementController.paiement.descriptionAvanceJustifie}" escape="true"/>
									</footer>
								</blockquote>
							</div>
						</div>
					</p:dialog>
					
					<p:dialog header="#{text['paiementDetail.title']}"
						resizable="false" id="displayEditAvance" widgetVar="dlgEditPay"
						showEffect="fade" hideEffect="highlight" modal="true">
						
						<div class="row">
							<div class="col-sm-6 form-group">
									<h:outputLabel styleClass="control-label" for="avance" value="#{text['paiement.avance']}" />
									<h:inputText id="avanceEditPay" value="#{paiementController.paiement.avance}" styleClass="form-control input-sm" required="false"/>
									<p:message for="avanceEditPay" />
							</div>
						</div>
						
						<div class="row">
					      	<div class="col-sm-12 form-group">
								<h:outputLabel styleClass="control-label" for="avanceJustifieEditPay" value="#{text['paiement.avanceJustifie']}" /><br/>
								<p:selectBooleanCheckbox id="avanceJustifieEditPay" value="#{paiementController.paiement.avanceJustifie}">  
						            <p:ajax update="@form" partialSubmit="true" oncomplete="dlgEditPay.show()" />  
						        </p:selectBooleanCheckbox> 
						        <p:watermark for="descriptionAvanceJustifieEditPay" value="#{text['paiement.description']}" /> 
								<h:inputTextarea rows="2" id="descriptionAvanceJustifieEditPay" rendered="#{paiementController.paiement.avanceJustifie}" value="#{paiementController.paiement.descriptionAvanceJustifie}" styleClass="form-control input-sm" required="false" maxlength="255" />
								<p:message for="descriptionAvanceJustifieEditPay" />
					      	</div>
	        			</div>
							
					</p:dialog>
			</h:form>
		</div>
	</ui:define>
</ui:composition>
</html>